<template>
	<div class="midVideo">
		<video :src="mp4" controls autoplay muted  ></video>
		<flop :sty="{
			w:'100%',
			h:'60rem'
		}" text="总输量$万立方米" :val="''+qq" ></flop>
	</div>
</template>
<script>
	const flop = () => import('../../components/flop/index.vue')
	export default {
		components: {
			flop
		},
		name: 'midVideo',
		data() {
			return {
				qq: 0,
				mp4: 'http://1251316161.vod2.myqcloud.com/29fe1275vodbj1251316161/dabb2b335285890810557990472/0aiWb0e5WpAA.mp4'
			}
		},
		created() {
			window.setInterval(() => {
				if (this.qq > 90000) {
					this.qq = 0
				} else {
					this.qq += 123
				}
			}, 1000)
		}
	}
</script>
<style lang='scss'>
	.midVideo {
		width: 90%;
		margin: 0 auto;
		position: relative;

		video {
			box-shadow: $bs;
			object-fit: fill;
			width: 98%;
			margin: 15rem auto 5rem;
			height: 220rem;
			border-radius: 15rem;
		}
	}
</style>
